@import "../../../styles/_commonColor.scss";

.confirmOrder {
  .barContent {
    background: white;
    padding: 45px 70px;
  }
  .serviceMessage {
    display: flex;
    padding: 30px;
    align-items: center;
    background: white;
    margin-top: 24px;
    img {
      display: block;
      width: 312px;
    }
    .content {
      color: $darkgray;
      flex: 1;
      & > div {
        text-align: right;
        font-size: 30px;
        &:nth-child(2) {
          font-size: 24px;
          margin-top: 10px;
        }
      }
    }
  }

  .orderMessage {
    margin-top: 42px;
    .messageItem {
      color: $gray;
      padding-right: 30px;
      font-size: 26px;
      & > div {
        &:nth-child(1) {
          margin:0;
        }
        margin-top: 20px;
        display: flex;
        & > div {
          &:nth-child(1) {
            width:40%;
            text-align: left;
          }
          &:nth-child(2) {
            width:60%;
            text-align: right;
          }
        }
        & > p {
          width:60%;
          text-align: right;
        }
      }
    }
  }

  .price{
    display: flex;
    padding:30px;
    font-size: 32px;
    margin-top: 24px;
    background: white;
    &>div{
      &:nth-child(1){
        color:$black;
        flex: 1;
      }
      &:nth-child(2){
        color:#FD8525;
      }
    }
  }

  .buttonContainer{
    padding:70px 30px 30px 30px;
    button{
      height:88px;
      width:100%;
      border:none;
      background: $slidergreen;
      outline: none;
      color:white;
      font-size: 30px;
      &:active{
        opacity: 0.8;
      }
    }
  }
}